<script setup lang="ts">
import { 
    computed,
    watch,
    watchEffect,
    watchPostEffect,
    watchSyncEffect,

    onBeforeMount,
    onMounted,
    onBeforeUnmount,
    onUnmounted,

    onBeforeUpdate,
    onUpdated,
    
    onErrorCaptured,
    onRenderTracked,
    onRenderTriggered,
    onActivated,
    onDeactivated,
    onServerPrefetch,

    useSlots, 
    useAttrs,
    nextTick,

    ref,
    isRef,
    unref,
    toValue,

    reactive,
    isReactive,

    readonly,
    isReadonly,
    
    isProxy,

    toRef,
    toRefs,
 } from "vue"
//  import * as vm from 'vue'
defineOptions({
    name:"",
    inheritAttrs: false,
    customOptions: {}
})
//  全局宏
// defineProps()
// defineEmits()
// defineExpose()
// defineOptions()
// defineSlots()
// const {attrs, emit, expose, slots} = context;
const props = defineProps(['title'])
const emit = defineEmits(['click'])
const slots = useSlots()
const attrs = useAttrs()

const title = ref("我是组合式 API 语法糖")

const a = ref(4);


const click = () => {
    a.value++;
    console.log(a);
}

// defineExpose({
//     title
// })
</script>

<template>
    <h1 @click="click">{{ title }} ---  a:{{ a }}</h1>
    
</template>